import React, { Component } from 'react'
const style = {
    "width":"100%",
    "height":"100%"
}
const styel1  = {
    "width":"100%",
    "height":"100%",
    "background":"rgba(0,0,0,.5)",
    "position":"relitive",
    "overflow":"hidden"
}
const style2 = {
    "width":"80%",
    "height":"90%",
    "position":"absolute",
    "left":"50%",
    "top":"50%",
    "background":"white",
    "transform": "translate(-50%, -50%)"


}
 class Mask extends Component {

    closeMask () {
      this.props.sendfn(false)
    }
  render() {
    console.log(this.props,1111)
    return (
      <div style={style}>
          <div style={styel1}>
              <div style = {style2} >
                  <div style={{"position":"relative"}}><span style={{"position":"absolute","right":"0"}} onClick={this.closeMask.bind(this)}>X</span></div>
                  <h3>{this.props.title}</h3>
              </div>
          </div>
      </div>
    )
  }
}

export default Mask